<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""DTD/xhtml1-strict.dtd">
<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib uri="/WEB-INF/c.tld" prefix="c"%>
<%@taglib uri="/WEB-INF/fmt.tld" prefix="fmt"%>
<%@taglib uri="/WEB-INF/el.tld" prefix="el"%>
<%@taglib uri="/WEB-INF/fn.tld" prefix="fn"%>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
		<title></title>
		<c:import url="/includes/css_inc.jsp"/>
		<c:import url="/includes/js_inc.jsp"/>
		<script>
		$(function(){
			var dhtml = new DHTML();
			var allocate = "";
			var count = $("#count").val();
			if (count == "" || count == null){
				count = 0;
			}
	        thaiDatepicker("chequeDateDisplay","#","1");
	       /*  var today = new Date();
			var tomorrow = new Date();
			tomorrow.setDate(today.getDate()+1);
			$("#chequeDateDisplay").datepicker({
				dateFormat : 'dd/mm/yy',
				showOn: 'button',
				buttonImage: 'images/calendar_full.png',
				buttonImageOnly: true,
				dayNamesMin: ['อา', 'จ', 'อ', 'พ', 'พฤ', 'ศ', 'ส'], 
				monthNamesShort: ['มกราคม','กุมภาพันธ์','มีนาคม','เมษายน','พฤษภาคม','มิถุนายน','กรกฎาคม','สิงหาคม','กันยายน','ตุลาคม','พฤศจิกายน','ธันวาคม'],
				changeMonth: true,
				changeYear: true ,
				isBuddhist: true ,
				minDate: tomorrow
			});
			$("#chequeDateDisplay").blur(function(){
				if($("#chequeDateDisplay").val() != null && $("#chequeDateDisplay").val() != "" ){
					result = diffDate($("#chequeDateDisplay").val(),day+"/"+month+"/"+year,"/");
					if (result == true){
						alert("กรุณาเลือกวันที่มากกว่าวันที่ : "+$("#expenseDate").val());
						$("#chequeDateDisplay").val("");
					}
				}
			}); */
			//chequeDateDisplay expenseDate
	        $("#allocateDisplay").combobox();
	        $("#vanderI").combobox();
			$("#btnSave").button({
	            icons: {
	                primary: "ui-icon-disk"
	            }
			}).click(function(){
	        	dateFormat(document.getElementById("expenseDate"));
	        	dateFormat(document.getElementById("chequeDateDisplay"));
				if ($("#isUpload").val()=="N"){
					$("#saveForm").removeAttr("enctype");
				}
				if($("#job").val()=="save" || $("#job").val()=="upload"){
					if($("#job").val()=="save" && validateEmpty()){
						enableField(["budgetYear"]);
						disableField(["btnSave","btnConfirm"]);
						$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
						$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
						$("#saveForm").submit();
					}else if ($("#job").val()=="upload" && validateEmptyById(["$budgetYear","#btnFile","@btn"])){
						$("#budgetYear").removeAttr('disabled');
						enableField(["budgetYear"]);
						$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
						$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
						$("#saveForm").submit();
					}
				}else{
					enableField(["budgetYear"]);
					disableField(["btnSave","btnConfirm"]);
					$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
					$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
					$("#saveForm").submit();
				}
			});

			$("#btnConfirm").button({
	            icons: {
	                primary: "ui-icon-circle-check"
	            }
			}).click(function(){
	        	dateFormat(document.getElementById("expenseDate"));
	        	dateFormat(document.getElementById("chequeDateDisplay"));
				if($("#job").val()=="save" || $("#job").val()=="upload"){
					if($("#job").val()=="save" && validateEmpty()){
						if(confirm('คุณต้องการยืนยันการส่งอนุมัติ?')==true){
							enableField(["budgetYear"]);
							$("#job").val("confirm");
							$("#saveForm").removeAttr("enctype");
							disableField(["btnSave","btnConfirm"]);
							$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
							$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
							$("#saveForm").submit();
						}
					}else if ($("#job").val()=="upload" && validateEmptyById(["$budgetYear","#btnFile"])){
						if(confirm('คุณต้องการยืนยันการส่งอนุมัติ?')==true){
							enableField(["budgetYear"]);
							$("#job").val("confirmUpload");
							disableField(["btnSave","btnConfirm"]);
							$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
							$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
							$("#saveForm").submit();
						}
					}
				}else{
					if(confirm('คุณต้องการยืนยันการส่งอนุมัติ?')==true){
						enableField(["budgetYear"]);
						$("#saveForm").removeAttr("enctype");
						$("#job").val("confirm");
						disableField(["btnSave","btnConfirm"]);
						$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
						$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
						$("#saveForm").submit();
					}
				}
			});
			$("[name=btnCopy]").button({
	            icons: {
	                primary: "ui-icon-copy"
	            },
	            text : false
			}).click(function(){
			});
			
			$("[name=btnDel]").button({
	            icons: {
	                primary: "ui-icon-closethick"
	            },
	            text : false
			});
			
			$("#btnUpdate").button({
	            icons: {
	                primary: "ui-icon-pencil"
	            }
			}).click(function() {
				var num;
				if ($("#job").val() != "edit") {
					num = targetId.split("_")[1];
				} else {
					num = $("#targetId").val();
				}
				document.getElementById("spanRefNo"+num).innerHTML = $("#refNoDisplay").val();
				document.getElementById("refNo"+num).value = $("#refNoDisplay").val();
				allocate = $("#allocateDisplay option:selected").text().split("-");
				var allocateSub = allocate[1];
				if(allocate[1].length > 20){
					allocateSub = allocate[1].substring(0,20)+"...";
				}
				document.getElementById("spanAllocate"+num).title = allocate[1];
				document.getElementById("spanAllocate"+num).value = allocateSub;
				document.getElementById("allocateName"+num).value = allocate[1];
				document.getElementById("allocateCode"+num).value = $("#allocateDisplay").val();

				var strVender = "";
				if($("#radioVenderC").is(":checked")){
					strVender = $("#vanderC option:selected").text();
					if(strVender.length > 20){
						strVender = strVender.substring(0,20)+"...";
					}
					document.getElementById("spanVander"+num).value = strVender;
					document.getElementById("spanVander"+num).title = strVender;
					document.getElementById("vander"+num).value = $("#vanderC").val();
				}else{
					strVender = $("#vanderI option:selected").text();
					if(strVender.length > 20){
						strVender = strVender.substring(0,20)+"...";
					}
					document.getElementById("spanVander"+num).value = strVender;
					document.getElementById("spanVander"+num).title = strVender;
					document.getElementById("vander"+num).value = $("#vanderI").val();
				}
				
				document.getElementById("spanChequeNo"+num).innerHTML = $("#chequeNoDisplay").val();
				document.getElementById("chequeNo"+num).value = $("#chequeNoDisplay").val();
				document.getElementById("spanChequeDate"+num).innerHTML = $("#chequeDateDisplay").val();
				document.getElementById("chequeDate"+num).value = $("#chequeDateDisplay").val();
				var categorySub = "";
				if ($("#categoryDisplay").val() != "") {
					categorySub = $("#categoryDisplay option:selected").text();
					if($("#categoryDisplay option:selected").text().length > 10){
						categorySub = $("#categoryDisplay option:selected").text().substring(0,10)+"...";
					}
				}
				document.getElementById("spanCategory"+num).innerHTML = categorySub;
				document.getElementById("spanCategory"+num).title = $("#categoryDisplay option:selected").text();
				document.getElementById("category"+num).value = $("#categoryDisplay").val();
				document.getElementById("spanChequeAmount"+num).innerHTML = $("#chequeAmountDisplay").val();
				document.getElementById("chequeAmount"+num).value = $("#chequeAmountDisplay").val();
				document.getElementById("spanTaxValue"+num).innerHTML = $("#taxValue").val();
				document.getElementById("taxValue"+num).value = $("#taxValue").val();
				document.getElementById("spanResponsibleName"+num).innerHTML = $("#responsibleNameDisplay").val();
				document.getElementById("responsibleName"+num).value = $("#responsibleNameDisplay").val();
				document.getElementById("spanChequeDesc"+num).innerHTML = $("#chequeDescDisplay").val();
				document.getElementById("chequeDesc"+num).value = $("#chequeDescDisplay").val();
				document.getElementById("checkDisplay"+num).disabled = false;
				if ($("#isBorrow").is(":checked")) {
					document.getElementById("checkDisplay"+num).checked = true;
					document.getElementById("isBorrow"+num).value = "Y";
				} else {
					document.getElementById("checkDisplay"+num).checked = false;
					document.getElementById("isBorrow"+num).value = "N";
				}
				document.getElementById("checkDisplay"+num).disabled = true;
				$("#btnAdd").css("display","");
				$("#btnUpdate").css("display","none");
				$("#btnUpdateCancel").css("display","none");
			});
			$("#btnUpdateCancel").button({
	            icons: {
	                primary: "ui-icon-close"
	            }
			}).click(function() {
				$("#btnAdd").css("display","");
				$("#btnUpdate").css("display","none");
				$("#btnUpdateCancel").css("display","none");
			});

			$("[name=btEdit]").button({
	            icons: {
	                primary: "ui-icon-pencil"
	            },
	            text : false
			});
			
			$("#btnAdd").button({
	            icons: {
	                primary: "ui-icon-plusthick"
	            }
			}).click(function() {
				if(validateEmpty()){
					enableField(["btnSave","btnConfirm"]);
					$("#payDetail").css("display","");
					$("#payTableDetail").css("display","");

					for(var i=0;i<count;i++){
						chequeId = "#chequeNo"+i;
						if ($(chequeId).val() == $("#chequeNoDisplay").val()){
							alert("เลขที่ cheque มีอยู่ในรายการแล้วกรุณาระบุเลขที่ cheque ใหม่");
							$("#chequeNoDisplay").val("");
							return false;
						}
					}
					
					//var tbody = dhtml.createElement(document.getElementById("payTableDetail"), ["tbody","id=list"+count+""], "");
					var tr = dhtml.createElement(document.getElementById("payTableDetail"), ["tr","id=tr_"+count], "");
					var td = dhtml.createElement(tr, ["td","align=center"], "");
					dhtml.createElement(td, ["span","id=spanRefNo"+count], $("#refNoDisplay").val());
					dhtml.createElement(td, ["input","type=hidden","name=refNo","id=refNo"+count,"value="+$("#refNoDisplay").val()],"");
					var td1 = dhtml.createElement(tr, ["td","align=left"], "");
					allocate = $("#allocateDisplay option:selected").text().split("-");
					var allocateSub = allocate[1];
					if(allocate[1].length > 20){
						allocateSub = allocate[1].substring(0,20)+"...";
					}
					dhtml.createElement(td1, ["input","type=text","id=spanAllocate"+count,"title="+allocate[1],"value="+allocateSub,"readonly=readonly"],"");
					dhtml.createElement(td1, ["input","type=hidden","name=allocate","id=allocateCode"+count,"value="+$("#allocateDisplay").val()],"");
					dhtml.createElement(td1, ["input","type=hidden","id=allocateName"+count,"value="+allocate[1]],"");
					var textId = "#spanAllocate"+count;
					$(textId).css("border","0");
					$(textId).css("background-color","#fff");
					
					var td2 = dhtml.createElement(tr, ["td","align=left"], "");
					var vanderSub = "";
					if($("#radioVenderC").is(":checked")){
						vanderSub = $("#vanderC option:selected").text();
						if($("#vanderC option:selected").text().length > 20){
							vanderSub = $("#vanderC option:selected").text().substring(0,20)+"...";
						}
						dhtml.createElement(td2, ["input","type=text","id=spanVander"+count,"title="+$("#vanderC option:selected").text(),"value="+vanderSub,"readonly=readonly"], "");
						dhtml.createElement(td2, ["input","type=hidden","name=vander","id=vander"+count,"value="+$("#vanderC").val()], "");
					} else {
						vanderSub = $("#vanderI option:selected").text();
						if($("#vanderI option:selected").text().length > 20){
							vanderSub = $("#vanderI option:selected").text().substring(0,20)+"...";
						}
						dhtml.createElement(td2, ["input","type=text","id=spanVander"+count,"title="+$("#vanderI option:selected").text(),"value="+vanderSub,"readonly=readonly"], "");
						dhtml.createElement(td2, ["input","type=hidden","name=vander","id=vander"+count,"value="+$("#vanderI").val()], "");
					}
					textId = "#spanVander"+count;
					$(textId).css("border","0");
					$(textId).css("background-color","#fff");
					
					var td3 = dhtml.createElement(tr, ["td","align=center"], "");
					dhtml.createElement(td3, ["span","id=spanChequeNo"+count], $("#chequeNoDisplay").val());
					dhtml.createElement(td3, ["input","type=hidden","name=chequeNo","id=chequeNo"+count, "value="+$("#chequeNoDisplay").val()], "");
					
					var td4 = dhtml.createElement(tr, ["td","align=center"], "");
					dhtml.createElement(td4, ["span","id=spanChequeDate"+count], $("#chequeDateDisplay").val());
					dhtml.createElement(td4, ["input","type=hidden","name=chequeDate","id=chequeDate"+count,"value="+$("#chequeDateDisplay").val()], "");
					var categorySub = "";
					if ($("#categoryDisplay").val() != "") {
						categorySub = $("#categoryDisplay option:selected").text();
						if($("#categoryDisplay option:selected").text().length > 10){
							categorySub = $("#categoryDisplay option:selected").text().substring(0,10)+"...";
						}
					}
					var td5 = dhtml.createElement(tr, ["td","align=left"], "");
					dhtml.createElement(td5, ["span","id=spanCategory"+count,"title="+$("#categoryDisplay option:selected").text()], categorySub);
					dhtml.createElement(td5, ["input","type=hidden","name=category","id=category"+count,"value="+$("#categoryDisplay").val()], "");
					var td6 = dhtml.createElement(tr, ["td","align=right"], "");
					dhtml.createElement(td6, ["span","id=spanChequeAmount"+count], $("#chequeAmountDisplay").val());
					dhtml.createElement(td6, ["input","type=hidden","name=chequeAmount","id=chequeAmount"+count,"value="+$("#chequeAmountDisplay").val()], "");
					var td7 = dhtml.createElement(tr, ["td","align=right"], "");
					dhtml.createElement(td7, ["span","id=spanTaxValue"+count], $("#taxValue").val());
					dhtml.createElement(td7, ["input","type=hidden","name=taxValue","id=taxValue"+count,"value="+$("#taxValue").val()], "");
					var td8 = dhtml.createElement(tr, ["td","align=left"], "");
					dhtml.createElement(td8, ["span","id=spanResponsibleName"+count], $("#responsibleNameDisplay").val());
					dhtml.createElement(td8, ["input","type=hidden","name=responsibleName","id=responsibleName"+count,"value="+$("#responsibleNameDisplay").val()], "");
					var td9 = dhtml.createElement(tr, ["td","align=left"], "");
					dhtml.createElement(td9, ["span","id=spanChequeDesc"+count], $("#chequeDescDisplay").val());
					dhtml.createElement(td9, ["input","type=hidden","name=chequeDesc","id=chequeDesc"+count,"value="+$("#chequeDescDisplay").val()+""], "");
					
					var td10 = dhtml.createElement(tr, ["td","align=center"], "");
					if ($("#isBorrow").is(":checked")) {
						dhtml.createElement(td10, ["input","type=checkbox","id=checkDisplay"+count,"disabled=disabled","checked=checked"], "");
						dhtml.createElement(td10, ["input","type=hidden","name=isBorrow","id=isBorrow"+count,"value=Y"], "");
					} else {
						dhtml.createElement(td10, ["input","type=checkbox","id=checkDisplay"+count,"disabled=disabled"], "");
						dhtml.createElement(td10, ["input","type=hidden","name=isBorrow","id=isBorrow"+count,"value=N"], "");
					}
					
					var td11 = dhtml.createElement(tr, ["td","align=center"], "");
					var editTR = dhtml.createElement(td11, ["a","id=btnEdit"+count+"","name=btnEdit","class=acc67-button"], "");
					var btnEdit = "#btnEdit"+count;
					$(btnEdit).button({
			            icons: {
			                primary: "ui-icon-pencil"
			            },
			            text : false
					});
					editTR.onclick = function () {
						targetId = tr.id;
						$("#btnAdd").css("display","none");
						$("#btnUpdate").css("display","");
						$("#btnUpdateCancel").css("display","");
						var num = targetId.split("_")[1];
						var venderCode = document.getElementById("vander"+num).value;
						$("#refNoDisplay").val(document.getElementById("refNo"+num).value);
						$('#allocateDisplaySpan input').val(document.getElementById("allocateCode"+num).value + " - " + document.getElementById("allocateName"+num).value);
						$('#allocateDisplay').val(document.getElementById("allocateCode"+num).value);
						$.ajax({
							type: "post",
							url: "${pageContext.request.contextPath}/acc67",
							dataType: "json",
							cache: false,
							data: {
								app: "ajax",
								job: "getProvinceIdByVenderCode",
								venderCode : venderCode
							},
							success: function(data) {
								if(data.length>0){
									if (data[0].provinceId == $("#provinceId").val()) {
										document.getElementById("radioVenderI").checked = true;
										if (data[0].venderAccount != null && data[0].venderAccount != "") {
											$('#vanderISpan input').val(data[0].venderAccount + " - " + data[0].venderName);
										} else {
											$('#vanderISpan input').val(data[0].venderName);
										}
										$.ajax({
											type: "post",
											url: "${pageContext.request.contextPath}/acc67",
											dataType: "json",
											cache: false,
											data: {
												app: "ajax",
												job: "getVenderByProvinceId",
												provinceId : $("#provinceId").val(),
												venderType : "C"
											},
											success: function(data) {
												if(data.length>0){
													for(var i=0;i<data.length;i++){
														if (data[i].code == venderCode) {
															dhtml.createElement(document.getElementById("vanderI"), ["option","value="+data[i].code,"selected=selected"],data[i].name);
														} else {
															dhtml.createElement(document.getElementById("vanderI"), ["option","value="+data[i].code],data[i].name);
														}
													}
												}
											}
										});
										
										$("#vanderC").attr('disabled',true);
										$("#vanderCSpan input").css('display','none');
										$("#vanderCSpan button").css('display','none');
										$("#vanderCSpan a").css('display','none');
										$('#vanderC')
											.find('option')
										    .remove()
										    .end()
										    .append('<option value=""></option>')
										    .val('')
										;
										document.getElementById("$vanderI").disabled = false;
										document.getElementById("$vanderC").disabled = true;
										document.getElementById("$provinceSelect").disabled = true;
										document.getElementById("provinceSelect").disabled = true;
										document.getElementById("provinceSelect").value = "";
										document.getElementById("$vanderI").style.display="";
										document.getElementById("$vanderC").style.display="none";
										document.getElementById("vanderC").style.display="none";
									} else {
										document.getElementById("radioVenderC").checked = true;
										$('#vanderI')
											.find('option')
										    .remove()
										    .end()
										    .append('<option value=""></option>')
										    .val('')
										;
										$("#vanderI").attr('disabled',true);
										$('#vanderISpan input').val("");
									    $("#vanderISpan input").attr('disabled',true);
									    $("#vanderISpan button").attr('disabled',true);
									    $("#vanderISpan a").attr('disabled',true);
										document.getElementById("$vanderI").style.display="none";
										document.getElementById("$vanderI").disabled = true;
										
										$("#provinceSelect").removeAttr("disabled");
										document.getElementById("provinceSelect").value = data[0].provinceId;
										document.getElementById("$vanderC").style.display="";
										$("#vanderCSpan input").css('display','');
										$("#vanderCSpan button").css('display','');
										$("#vanderCSpan a").css('display','');
										$.ajax({
											type: "post",
											url: "${pageContext.request.contextPath}/acc67",
											dataType: "json",
											cache: false,
											data: {
												app: "ajax",
												job: "getVenderByProvinceId",
												provinceId : data[0].provinceId,
												venderType : "C"
											},
											success: function(data) {
												if(data.length>0){
													for(var i=0;i<data.length;i++){
														if (data[i].code == venderCode) {
															dhtml.createElement(document.getElementById("vanderC"), ["option","value="+data[i].code,"selected=selected"],data[i].name);
														} else {
															dhtml.createElement(document.getElementById("vanderC"), ["option","value="+data[i].code],data[i].name);
														}
													}
												}
											}
										});
										if (data[0].venderAccount != null && data[0].venderAccount != "") {
											$('#vanderCSpan input').val(data[0].venderAccount + " - " + data[0].venderName);
										} else {
											$('#vanderCSpan input').val(data[0].venderName);
										}
									}
								}
							}
						});
						$("#chequeNoDisplay").val(document.getElementById("chequeNo"+num).value);
						$("#chequeDateDisplay").val(document.getElementById("chequeDate"+num).value);
						$("#categoryDisplay").val(document.getElementById("category"+num).value);
						$("#chequeAmountDisplay").val(document.getElementById("chequeAmount"+num).value);
						$("#taxValue").val(document.getElementById("taxValue"+num).value);
						$("#responsibleNameDisplay").val(document.getElementById("responsibleName"+num).value);
						$("#chequeDescDisplay").val(document.getElementById("chequeDesc"+num).value);
						var isBorrow = document.getElementById("isBorrow"+num).value;
						if (isBorrow == "Y") {
							document.getElementById("isBorrow").checked = true;
						} else {
							document.getElementById("isBorrow").checked = false;
						}
					}
					
					var td12 = dhtml.createElement(tr, ["td","align=left"], "");
					var delTR = dhtml.createElement(td12, ["button","id=btnDel"+count+"","name=btnDel","class=acc67-button"], "");
					var btnDel = "#btnDel"+count;
					$(btnDel).button({
			            icons: {
			                primary: "ui-icon-closethick"
			            },
			            text : false
					});
					delTR.onclick = function () {
						dhtml.removeElement(tbody);
						count--;
						if(count == 0){
							$("#payDetail").css("display","none");
							$("#payTableDetail").css("display","none");
							disableField(["btnSave","btnConfirm"]);
							$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
							$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
						}
					}
					count++;
					$("#count").val(count);
					enableField(["btnSave","btnConfirm"]);
					$("#btnSave").removeClass("ui-button-disabled ui-state-disabled");
					$("#btnConfirm").removeClass("ui-button-disabled ui-state-disabled");
					}
				});
				
				$("#btnBack").button({
		            icons: {
		                primary: "ui-icon-arrowreturnthick-1-w"
		            }
				}).click(function(){
					$("#job").val("back");
					$("#saveForm").removeAttr("enctype");
					$("#saveForm").submit();
				});
				$("#radioVenderI").click(function(){
				    $("#vanderISpan input").removeAttr('disabled');
				    $("#vanderISpan button").removeAttr('disabled');
				    $("#vanderISpan a").removeAttr('disabled');
				    
					$("#provinceSelect").attr("disabled","disabled");
					$("#provinceSelect").val("");

				    $("#vanderI").removeAttr('disabled');
					$("#vanderC").attr('disabled',true);
					$('#vanderISpan input').val("");
				    $("#vanderCSpan input").css('display','none');
				    $("#vanderCSpan button").css('display','none');
				    $("#vanderCSpan a").css('display','none');

					$('#vanderC')
						.find('option')
					    .remove()
					    .end()
					    .append('<option value=""></option>')
					    .val('')
					;
					
					document.getElementById("$vanderI").disabled = false;
					document.getElementById("$vanderC").disabled = true;
					document.getElementById("$provinceSelect").disabled = true;
					document.getElementById("$vanderI").style.display="";
					document.getElementById("$vanderC").style.display="none";
					document.getElementById("vanderC").style.display="none";
					document.getElementById("$provinceSelect").style.display="none";
					
					$('#vanderI')
					.find('option')
				    .remove()
				    .end()
				    .append('<option value=""></option>')
				    .val('');
					$('#vanderISpan input').val("");
					$.ajax({
						type: "post",
						url: "${pageContext.request.contextPath}/acc67",
						dataType: "json",
						cache: false,
						data: {
							app: "ajax",
							job: "getVenderByProvinceId",
							provinceId : $("#provinceId").val(),
							venderType : "C"
						},
						success: function(data) {
							if(data.length>0){
								for(var i=0;i<data.length;i++){
									dhtml.createElement(document.getElementById("vanderI"), ["option","value="+data[i].code],data[i].name);
								}
							}
						}
					});
					
				});
				$("#radioVenderC").click(function(){
					$("#provinceSelect").removeAttr("disabled");
					//$("#vanderC").css("display","");
					$("#vanderC").combobox();
					$('#vanderC')
						.find('option')
					    .remove()
					    .end()
					    .append('<option value=""></option>')
					    .val('');

				    $("#vanderC").removeAttr('disabled');
					$("#vanderI").attr('disabled',true);
					$('#vanderISpan input').val("");
				    $("#vanderISpan input").attr('disabled',true);
				    $("#vanderISpan button").attr('disabled',true);
				    $("#vanderISpan a").attr('disabled',true);

					$('#vanderCSpan input').val("");
				    $("#vanderCSpan input").css('display','');
				    $("#vanderCSpan button").css('display','');
				    $("#vanderCSpan a").css('display','');
				    
					document.getElementById("$vanderI").disabled = true;
					document.getElementById("$vanderC").disabled = false;
					document.getElementById("$provinceSelect").disabled = false;
					document.getElementById("$vanderI").style.display="none";
					document.getElementById("$vanderC").style.display="";
					document.getElementById("$provinceSelect").style.display="";
				});
				$("#provinceSelect").change(function(){
					document.getElementById("vanderC").InnerHTML = "";
					$('#vanderC')
					.find('option')
				    .remove()
				    .end()
				    .append('<option value=""></option>')
				    .val('');
					$('#vanderCSpan input').val("");
					$.ajax({
						type: "post",
						url: "${pageContext.request.contextPath}/acc67",
						dataType: "json",
						cache: false,
						data: {
							app: "ajax",
							job: "getVenderByProvinceId",
							provinceId : $("#provinceSelect").val(),
							venderType : "C"
						},
						success: function(data) {
							if(data.length>0){
								for(var i=0;i<data.length;i++){
									dhtml.createElement(document.getElementById("vanderC"), ["option","value="+data[i].code],data[i].name);
								}
							}
						}
					});
				});

				if ($("#job").val() != "edit"){
					disableField(["btnSave","btnConfirm"]);
				}
				
				$("#btnAddList").click(function(){
					if (validateEmptyById(["$provinceId","$budgetYear"])) {
						disableField(["budgetYear"]);
						$("#chequeList").css("display",""); 
						$("#fieldUpload").css("display","none"); 
						//alert($("#count").val());
						if ($("#count").val()!=0){
							$("#payDetail").css("display",""); 
						}
						$("#job").val("save");
						$("#isUpload").val("N");
					    $("#btnFile").attr('disabled',true);
					    $("#btnSave").attr('disabled',true);
					    $("#btnConfirm").attr('disabled',true);
						$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
						$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
						//Get vender By Province.
						$('#vanderI')
						.find('option')
					    .remove()
					    .end()
					    .append('<option value=""></option>')
					    .val('');
						$('#vanderISpan input').val("");
						$.ajax({
							type: "post",
							url: "${pageContext.request.contextPath}/acc67",
							dataType: "json",
							cache: false,
							data: {
								app: "ajax",
								job: "getVenderByProvinceId",
								provinceId : $("#provinceId").val(),
								venderType : "C"
							},
							success: function(data) {
								if(data.length>0){
									for(var i=0;i<data.length;i++){
										dhtml.createElement(document.getElementById("vanderI"), ["option","value="+data[i].code],data[i].name);
									}
								}
							}
						});
					} else {
						document.getElementById("btnAddList").checked = false;
					}
				});
				$("#btnUpload").click(function(){
					if (validateEmptyById(["$provinceId","$budgetYear"])) {
						disableField(["budgetYear"]);
						$("#fieldUpload").css("display",""); 
						$("#chequeList").css("display","none");
						$("#payDetail").css("display","none");
						$("#job").val("upload");
						$("#isUpload").val("Y");
					    $("#btnFile").attr('disabled',false);
					    $("#btnSave").attr('disabled',false);
					    $("#btnConfirm").attr('disabled',false);
						$("#btnSave").removeClass("ui-button-disabled ui-state-disabled");
						$("#btnConfirm").removeClass("ui-button-disabled ui-state-disabled");
					} else {
						document.getElementById("btnUpload").checked = false;
					}
				});
				if (count == 0){
					disableField(["btnSave","btnConfirm"]);
					$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
					$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
				}
				$("#btnDownload").button({
		            icons: {
		                primary: "ui-icon-arrowthickstop-1-s"
		            }
				}).click(function(){
					window.location='${pageContext.request.contextPath}/acc6?app=ACC60302&job=downloadTemplateCheque';
				});
				$("#chequeNoDisplay").blur(function(){
					var chequeId = "";
					$.ajax({
						type: "post",
						url: "/provacc/acc67",
						dataType: "json",
						async: false,
						cache: false,
						data: {
							app: "ajax",
							job: "getChequeNo",
							provinceId : $("#provinceId").val(),
							chequeNo : $("#chequeNoDisplay").val()
						},
						success: function(data) {
							if (data[0].result == "1"){
								alert("เลขที่ cheque มีอยู่แล้วในระบบกรุณาระบุเลขที่ cheque ใหม่");
								$("#chequeNoDisplay").val("");
							}
						}
					});
				});
				$("#provinceId").change(function(){
					$('#vanderI')
					.find('option')
				    .remove()
				    .end()
				    .append('<option value=""></option>')
				    .val('');
					$('#vanderISpan input').val("");
					$.ajax({
						type: "post",
						url: "${pageContext.request.contextPath}/acc67",
						dataType: "json",
						cache: false,
						data: {
							app: "ajax",
							job: "getVenderByProvinceId",
							provinceId : $("#provinceId").val(),
							venderType : "C"
						},
						success: function(data) {
							if(data.length>0){
								for(var i=0;i<data.length;i++){
									dhtml.createElement(document.getElementById("vanderI"), ["option","value="+data[i].code],data[i].name);
								}
							}
						}
					});
				});
			});
		function removeExpenseCheque(seq){
			/*var dhtml = new DHTML();
			if(confirm('คุณต้องการลบรายการรายจ่าย?')==true){
				var id = object.parentNode.parentNode.id;
				dhtml.removeElementById(id);
				$("#count").val($("#count").val()-1);
				if($("#count").val() == 0){
					disableField(["btnSave","btnConfirm"]);
					$("#payDetail").css("display","none");
					$("#payTableDetail").css("display","none");
					$("#btnSave").addClass("ui-button-disabled ui-state-disabled");
					$("#btnConfirm").addClass("ui-button-disabled ui-state-disabled");
				}
			}*/
			if(confirm('คุณต้องการลบรายการรายจ่าย?')==true){
				$("#saveForm").removeAttr("enctype");
				$("#chequeSeq").val(seq);
				$("#job").val("deleteChq");
				$("#saveForm").submit();
			}
		}
		function copyExpenseTransfer(object){
			var id = object.parentNode.parentNode.id;
			$("#listData").append("<tr id=\""+(parseInt($("#maxSeq").val())+parseInt(1))+"\">"+""+$("#"+id).html()+"</tr>");
			$("#maxSeq").val(parseInt($("#maxSeq").val())+parseInt(1));
		}
		function checkNegative(chequeAmountDisplayValue){					
			var chequeAmount = document.getElementsByName("chequeAmount");
			var allocate = document.getElementsByName("allocate");
			var sum = 0.00;
			if (chequeAmount.length != null && chequeAmount.length > 0){
				for(var i=0;i<chequeAmount.length;i++){
					if(chequeAmount[i].value != "" && allocate[i].value == $("#allocateDisplay").val()){
						sum = parseFloat(sum) + toFloat(chequeAmount[i].value);
					}
				}
			}
			sum = parseFloat(sum) + toFloat(chequeAmountDisplayValue);
			$.ajax({
				type: "post",
				url: "/provacc/acc67",
				dataType: "json",
				async: false,
				cache: false,
				data: {
					app: "ajax",
					job: "getRemain",
					provinceId: $("#provinceId").val(),
					budgetYear: $("#budgetYear").val(),
					allocateCode: $("#allocateDisplay").val()
				},
				success: function(data) {
					if(data[0].result == "1"){
						for(var i=0;i<data.length;i++){
							if (toFloat(data[i].remain) < sum && data[i].negative == "0"){
								alert("ยอดคงเหลือ "+data[i].remain+" ติดลบไม่ได้");
								document.getElementById("chequeAmountDisplay").value = "";
							}else if (toFloat(data[i].remain) < 0 && (data[i].negative == "1" || data[i].negative == "0")){
								alert("ยอดคงเหลือ "+data[i].remain+" ติดลบได้ 1 ครั้ง");
								document.getElementById("chequeAmountDisplay").value = "";
							}
						}
					}else{
						return false;
					}
				}
			});
		}
		function getAllocateByBudgetYear(value){
			var dhtml = new DHTML();
			$('#allocateDisplaySpan input').val("");
			$('#allocateDisplay')
			.find('option')
		    .remove()
		    .end()
		    .append('<option value=""></option>')
		    .val('');
			if(value != ""){
				$.ajax({
					type: "post",
					url: "/provacc/acc67",
					dataType: "json",
					async: false,
					cache: false,
					data: {
						app: "ajax",
						job: "getAllocate",
						budgetYear: value
					},
					success: function(data) {
						if(data.length > 0){
							for(var i=0;i<data.length;i++){
								dhtml.createElement(document.getElementById("allocateDisplay"), ["option","value="+data[i].code], data[i].code +" - "+ data[i].name);
							}
						}else{
							return false;
						}
					}
				});
			}
		}
		function editData(num){
			var dhtml = new DHTML();
			$("#btnAdd").css("display","none");
			$("#btnUpdate").css("display","");
			$("#btnUpdateCancel").css("display","");
			var venderCode = document.getElementById("vander"+num).value;
			$("#refNoDisplay").val(document.getElementById("refNo"+num).value);
			$('#allocateDisplaySpan input').val(document.getElementById("allocateCode"+num).value + " - " + document.getElementById("allocateName"+num).value);
			$('#allocateDisplay').val(document.getElementById("allocateCode"+num).value);
			$.ajax({
				type: "post",
				url: "${pageContext.request.contextPath}/acc67",
				dataType: "json",
				cache: false,
				data: {
					app: "ajax",
					job: "getProvinceIdByVenderCode",
					venderCode : venderCode
				},
				success: function(data) {
					if(data.length>0){
						if (data[0].provinceId == $("#provinceId").val()) {
							document.getElementById("radioVenderI").checked = true;
							if (data[0].venderAccount != null && data[0].venderAccount != "") {
								$('#vanderISpan input').val(data[0].venderAccount + " - " + data[0].venderName);
							} else {
								$('#vanderISpan input').val(data[0].venderName);
							}
							$.ajax({
								type: "post",
								url: "${pageContext.request.contextPath}/acc67",
								dataType: "json",
								cache: false,
								data: {
									app: "ajax",
									job: "getVenderByProvinceId",
									provinceId : $("#provinceId").val(),
									venderType : "C"
								},
								success: function(data) {
									if(data.length>0){
										for(var i=0;i<data.length;i++){
											if (data[i].code == venderCode) {
												dhtml.createElement(document.getElementById("vanderI"), ["option","value="+data[i].code,"selected=selected"],data[i].name);
											} else {
												dhtml.createElement(document.getElementById("vanderI"), ["option","value="+data[i].code],data[i].name);
											}
										}
									}
								}
							});
							
							$("#vanderC").attr('disabled',true);
							$("#vanderCSpan input").css('display','none');
							$("#vanderCSpan button").css('display','none');
							$("#vanderCSpan a").css('display','none');
							$('#vanderC')
								.find('option')
							    .remove()
							    .end()
							    .append('<option value=""></option>')
							    .val('')
							;
							document.getElementById("$vanderI").disabled = false;
							document.getElementById("$vanderC").disabled = true;
							document.getElementById("$provinceSelect").disabled = true;
							document.getElementById("provinceSelect").disabled = true;
							document.getElementById("provinceSelect").value = "";
							document.getElementById("$vanderI").style.display="";
							document.getElementById("$vanderC").style.display="none";
							document.getElementById("vanderC").style.display="none";
						} else {
							document.getElementById("radioVenderC").checked = true;
							$('#vanderI')
								.find('option')
							    .remove()
							    .end()
							    .append('<option value=""></option>')
							    .val('')
							;
							$("#vanderI").attr('disabled',true);
							$('#vanderISpan input').val("");
						    $("#vanderISpan input").attr('disabled',true);
						    $("#vanderISpan button").attr('disabled',true);
						    $("#vanderISpan a").attr('disabled',true);
							document.getElementById("$vanderI").style.display="none";
							document.getElementById("$vanderI").disabled = true;
							
							$("#provinceSelect").removeAttr("disabled");
							document.getElementById("provinceSelect").value = data[0].provinceId;
							document.getElementById("$vanderC").style.display="";
							document.getElementById("vanderC").disabled = false;
							$("#vanderCSpan input").css('display','');
							$("#vanderCSpan button").css('display','');
							$("#vanderCSpan a").css('display','');
							$("#vanderC").combobox();
							$.ajax({
								type: "post",
								url: "${pageContext.request.contextPath}/acc67",
								dataType: "json",
								cache: false,
								data: {
									app: "ajax",
									job: "getVenderByProvinceId",
									provinceId : data[0].provinceId,
									venderType : "C"
								},
								success: function(data) {
									if(data.length>0){
										for(var i=0;i<data.length;i++){
											if (data[i].code == venderCode) {
												dhtml.createElement(document.getElementById("vanderC"), ["option","value="+data[i].code,"selected=selected"],data[i].name);
											} else {
												dhtml.createElement(document.getElementById("vanderC"), ["option","value="+data[i].code],data[i].name);
											}
										}
									}
								}
							});
							if (data[0].venderAccount != null && data[0].venderAccount != "") {
								$('#vanderCSpan input').val(data[0].venderAccount + " - " + data[0].venderName);
							} else {
								$('#vanderCSpan input').val(data[0].venderName);
							}
						}
					}
				}
			});
			$("#chequeNoDisplay").val(document.getElementById("chequeNo"+num).value);
			$("#chequeDateDisplay").val(document.getElementById("chequeDate"+num).value);
			$("#categoryDisplay").val(document.getElementById("category"+num).value);
			$("#chequeAmountDisplay").val(document.getElementById("chequeAmount"+num).value);
			$("#taxValue").val(document.getElementById("taxValue"+num).value);
			$("#responsibleNameDisplay").val(document.getElementById("responsibleName"+num).value);
			$("#chequeDescDisplay").val(document.getElementById("chequeDesc"+num).value);
			var isBorrow = document.getElementById("isBorrow"+num).value;
			if (isBorrow == "Y") {
				document.getElementById("isBorrow").checked = true;
			} else {
				document.getElementById("isBorrow").checked = false;
			}
			document.getElementById("targetId").value = num;
		}
		</script>
	</head>
	<body>
		<c:set var="auth" value="${el:getMapValue(menuAuth, 'ACC60302')}"/>
		<c:import url="/apps/msg.jsp"/>
		<form class="acc67-form" name="saveForm" id="saveForm" action="${pageContext.request.contextPath}/acc6" enctype="multipart/form-data" method="post">
		<input type="hidden" name="app" id="app" value="ACC60302"/>
		<input type="hidden" name="job" id="job" value="${job}"/>
		<input type="hidden" name="count" id="count" value="${count}"/>
		<input type="hidden" name="maxSeq" id="maxSeq" value="${maxSeq}"/>
		<input type="hidden" name="docNo" id="docNo" value="${docNo}"/>
		<input type="hidden" name="chequeSeq" id="chequeSeq" value="0"/>
		<input type="hidden" name="docNoForDel" id="docNoForDel" value=""/>
		<input type="hidden" name="isUpload" id="isUpload" value="N"/>
		<input type="hidden" name="targetId" id="targetId" value="0"/>
		<input type="hidden" name="mode" id="mode" value="${mode}"/>
		<table width="100%" class="ui-widget ui-widget-content" border="0">
			<tr>
				<th align="left" class="acc67-header ui-widget-header" colspan="2"><b>${screenCode.ACC60302}</b></th>
			</tr>
			<tr>
				<td class="bold" width="15%">เลขที่เอกสาร : </td>
				<td>${docNo}</td>
			</tr>
			<tr>
				<td class="bold">จังหวัด : </td>
				<td>
					<c:if test="${userInfo.areaLevel =='3'}">
						<c:forEach var="data" items="${userInfo.listUserProvice}">
							${data.provinceName}
							<input type="hidden" name="provinceId" id="provinceId" value="${data.provinceId}">
							<span id="$provinceId" style="display: none"></span>
						</c:forEach>
					</c:if>
					<c:if test="${userInfo.areaLevel=='1' || userInfo.areaLevel=='2'}">
						<c:if test="${job == 'save'}">
							<select name="provinceId" id="provinceId">
								<option value="">----- เลือก -----</option>
								<c:forEach var="data" items="${userInfo.listUserProvice}">
									<c:if test="${data.provinceId == provinceId}" var="provinceSeleted"/>
									<option value="${data.provinceId}" ${provinceSeleted?'selected':''}>${data.provinceName}</option>
								</c:forEach>
							</select>
							<span id="$provinceId" class="red">*</span>
						</c:if>
						<c:if test="${job == 'edit'}">
							${provinceName}
							<input type="hidden" name="provinceId" id="provinceId" value="${provinceId}">
						</c:if>
					</c:if>
				</td>
			</tr>
			<tr>
				<td class="bold">ปีงบประมาณ : </td>
				<td>
					<c:if test="${job == 'save'}">
					<select name="budgetYear" id="budgetYear" onchange="getAllocateByBudgetYear(this.value);">
						<option value="">----- เลือก -----</option>
						<c:forEach  var="data" items="${listBudgetYear}">
							<c:if test="${data.BUDGET_YEAR == expenseBean.budgetYear}" var="budgetYearSeleted"/>
							<option value="${data.BUDGET_YEAR}" ${budgetYearSeleted?'selected':''}>${data.BUDGET_YEAR}</option>
						</c:forEach>
					</select>
					<span id="$budgetYear" class="red">*</span>
					</c:if>
					<c:if test="${job == 'edit'}">
						${expenseBean.budgetYear}
						<input type="hidden" name="budgetYear" id="budgetYear" value="${expenseBean.budgetYear}">
					</c:if>
				</td>
			</tr>
			<tr>
				<td class="bold">วันที่ทำรายการ : </td>
				<td>
					<c:if test="${job == 'save'}">
						${now}
						<input type="hidden" name="expenseDate" id="expenseDate" value="${now}">
					</c:if>
					<c:if test="${job == 'edit'}">
						${el:dateTh(expenseBean.expenseDate)}
						<input type="hidden" name="expenseDate" id="expenseDate" value="${el:dateTh(expenseBean.expenseDate)}">
					</c:if>
				</td>
			</tr>
<%-- 			<tr>
				<td class="bold">วันที่จ่าย : </td> 
				<td>
					<input type="text" name="expenseDate" id="expenseDate" size="12" maxlength="10" onkeypress="return numberAndSlash(event);" onblur="dateFormat(this);" value="${el:dateTh(expenseBean.expenseDate)}"/>
					<span id="#expenseDate" class="red">*</span>
				</td>
			</tr> --%>
			<tr>
				<td class="bold">ชื่อการจ่าย : </td>
				<td>
					<input type="text" name="expenseSubject" id="expenseSubject" value="${expenseBean.expenseSubject}">
				</td>
			</tr>
<%-- 			<tr>
				<td class="bold">ชื่อผู้รับผิดชอบ : </td>
				<td>
					<input type="text" name="approveName" id="approveName" value="${expenseBean.responsibleName}"/>
				</td>
			</tr> --%>
			<tr>
				<td class="bold" valign="top">คำอธิบายการจ่าย : </td>
				<td>
					<textarea cols="25" rows="3" name="expenseDesc" id="expenseDesc">${expenseBean.expenseDesc}</textarea>
				</td>
			</tr>
			<c:if test="${job == 'save'}">
				<tr>
					<td class="bold"></td>
					<td>
						<input type="radio" name="btn" id="btnAddList" />เพิ่มรายการ
						</br>
						<input type="radio" name="btn" id="btnUpload" />upload excel
						<span id="@btn" class="red">*</span>
					</td>
				</tr>
			</c:if>
			<tr>
				<td colspan="2">
				<fieldset id="chequeList" style="display: ${display};">
					<legend> เพิ่มการจ่าย Cheque </legend>
					<table width="100%" class="ui-widget ui-widget-content">
					<tr>
							<td class="bold">เอกสารอ้างอิง : </td>
							<td colspan="3">
								<input type="text" name="refNoDisplay" id="refNoDisplay" maxlength="50" value=""/>
								<span id="#refNoDisplay" class="red">*</span>
							</td>
						</tr> 
						<tr>
							<td class="bold" width="20%">กองทุนย่อยเฉพาะด้าน : </td>
							<td colspan="3">
								<span id="allocateDisplaySpan">
									<select name="allocateDisplay" id="allocateDisplay">
										<option value="">----- เลือก -----</option>
										<c:forEach items="${lsAllocate}" var="lsAllocateData">
											<option value="${lsAllocateData.ALLOCATE_CODE}">${lsAllocateData.ALLOCATE_CODE} - ${lsAllocateData.ALLOCATE_NAME}</option>
										</c:forEach>
									</select>
									&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
									<span id="$allocateDisplay" class="red" style="position: absolute;">*</span>
								</span>
							</td>
						</tr>
						<tr>
							<td class="bold"> หน่วยบริการ/คู่สัญญา : </td>
							<td colspan="3">
								<input type="radio" name="radioVender" id="radioVenderI" value="I" checked="checked"/>ในจังหวัด &nbsp;:&nbsp;
								<span id="vanderISpan">
									<select name="vanderDisplay" id="vanderI">
										<option value="">----- เลือก -----</option>
										<c:forEach items="${listVender}" var="listVenderData">
											<option value="${listVenderData.venderCode}">${listVenderData.venderName}</option>
										</c:forEach>
									</select>
								</span>
								&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
								<span id="$vanderI" class="red" style="position: absolute;">*</span>
							</td>
						</tr>
						<tr> 
							<td></td>
							<td colspan="3">
								<input type="radio" name="radioVender" id="radioVenderC" value="C"/>ข้ามจังหวัด
								<select name="provinceSelect" id="provinceSelect" disabled="disabled">
									<option value="">----- เลือก -----</option>
									<c:forEach items="${listProviceC}" var="listProviceCData">
										<option value="${listProviceCData.PROVINCE_ID}">${listProviceCData.PROVINCE_NAME}</option>
									</c:forEach>
								</select>
								<span id="$provinceSelect" class="red" style="display: none;" disabled="disabled">*</span>
								&nbsp;:&nbsp;
								<span id="vanderCSpan">
									<select name="vanderDisplay" id="vanderC" style="display: none;" disabled="disabled">
										<option value="">----- เลือก -----</option>
									</select>
								</span>
								&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
								<span id="$vanderC" class="red" style="display: none;" disabled="disabled" style="position: absolute;">*</span>
							</td>
						</tr>
						<tr>
							<td class="bold">เลขที่ cheque : </td>
							<td>
								<input type="text" name="chequeNoDisplay" id="chequeNoDisplay" maxlength="8" onkeypress="return numberAndDot(event, false);">
								<span id="#chequeNoDisplay" class="red">*</span>
							</td>
							<td class="bold">วันที่สั่งจ่าย : </td>
							<td>
								<input type="text" name="chequeDateDisplay" id="chequeDateDisplay" size="12" maxlength="10" onkeypress="return numberAndSlash(event);" onblur="dateFormat(this);">
								<span id="#chequeDateDisplay" class="red">*</span>
							</td>
						</tr>
						<tr>
							<td class="bold">หมวดการจ่าย : </td>
							<td>
								<input type="checkbox" id="isBorrow"> เงินยืม
								<select name="categoryDisplay" id="categoryDisplay">
									<option value="">----- เลือก -----</option>
									<c:forEach items="${listCategory}" var="listCategoryData">
										<option value="${listCategoryData.categoryId}">${listCategoryData.categoryName}</option>
									</c:forEach>
								</select>
							</td>
							<td class="bold">จำนวนเงิน : </td>
							<td>
								<input type="text" name="chequeAmountDisplay" id="chequeAmountDisplay" onkeypress="return numberAndDot(event, false);" onblur="this.value = addCommas2D(this.value); checkNegative(this.value);"/>
								<span id="#chequeAmountDisplay" class="red">*</span>
							</td>
						</tr>
						<tr valign="top">
							<td class="bold">ภาษี : </td>
							<td>
								<input type="text" id="taxValue" onkeypress="return numberAndDot(event, false);" onblur="this.value = addCommas2D(this.value);"/>
								<span id="#taxValue" class="red">*</span>
							</td>
							<td class="bold">ชื่อผู้รับผิดชอบ : </td>
							<td>
								<input type="text" name="responsibleNameDisplay" id="responsibleNameDisplay" value=""/>
							</td>
						</tr>
						<tr>
							<td class="bold" valign="top">ชื่อโครงการ/คำอธิบาย : </td>
							<td>
								<textarea name="chequeDescDisplay" id="chequeDescDisplay" cols="30" rows="3"></textarea>
								<span id="#chequeDescDisplay" class="red">*</span>
							</td>
						</tr>
						<tr>
							<td align="center" colspan="4">
								<button type="button" name="btnAdd" id="btnAdd" class="acc67-button">เพิ่มรายการ</button>
								<button style="display: none;" type="button" name="btnUpdate" id="btnUpdate" class="acc67-button">แก้ไขรายการ</button>
								<button style="display: none;" type="button" name="btnUpdateCancel" id="btnUpdateCancel" class="acc67-button">ยกเลิกแก้ไขรายการ</button>
							</td>
						</tr>
					</table>
				</fieldset>
				</td>
			</tr>
			<tr>
				<td colspan="2">
					<fieldset id="payDetail" style="display: ${display};">
						<legend>รายละเอียดการจ่าย Cheque </legend>
						<table width="100%" class="acc67-grid ui-widget ui-widget-content" id="payTableDetail">
							<tr>
								<th align="center" class="ui-state-default" width="7%">เอกสารอ้างอิง</th>
								<th align="center" class="ui-state-default" width="9%">กองทุนย่อยเฉพาะด้าน</th>
								<th align="center" class="ui-state-default" width="9%">หน่วยบริการ/คู่สัญญา</th>
								<th align="center" class="ui-state-default" width="5%">เลขที่ cheque</th>
								<th align="center" class="ui-state-default" width="5%">วันที่สั่งจ่าย</th>
								<th align="center" class="ui-state-default" width="9%">หมวดการจ่าย</th>
								<th align="center" class="ui-state-default" width="7%">จำนวนเงิน</th>
								<th align="center" class="ui-state-default" width="5%">ภาษี</th>
								<th align="center" class="ui-state-default" width="9%">ชื่อผู้รับผิดชอบ</th> 
								<th align="center" class="ui-state-default">ชื่อโครงการ/คำอธิบาย</th>
								<th align="center" class="ui-state-default" width="5%">เงินยืม</th>
								<th align="center" class="ui-state-default" width="5%">แก้ไข</th>
								<th align="center" class="ui-state-default" width="5%">ลบ</th>
							</tr>
							<c:if test="${!empty listExpenseCheque}">
								<c:forEach items="${listExpenseCheque}" var="data" varStatus="x">
										<tr id="tr_tbody_${data.docNo}${data.chequeSeq}">
											<td align="center">
												<span id="spanRefNo${x.count}">${data.refNo}</span>
												<input type="hidden" name="refNo" id="refNo${x.count}" value="${data.refNo}">
											</td>
											<td align="left">
												<input type="text" title="${data.allocateName}" id="spanAllocate${x.count}" value="${data.allocateSub}" style="border: 0;background-color: ;#fff"/>
												<input type="hidden" name="allocate" id="allocateCode${x.count}" value="${data.allocateCode}">
												<input type="hidden" name="allocateName" id="allocateName${x.count}" value="${data.allocateName}">		
											</td>
											<td align="left">
												<input type="text" title="${data.venderName}" id="spanVander${x.count}" value="${data.venderSub}" style="border: 0;background-color: ;#fff"/>
												<input type="hidden" name="vander" id="vander${x.count}" value="${data.venderCode}">
											</td>
											<td align="center">
												<span id="spanChequeNo${x.count}">${data.chequeNo}</span>
												<input type="hidden" name="chequeNo" id="chequeNo${x.count}" value="${data.chequeNo}">
											</td>
											<td align="center">
												<span id="spanChequeDate${x.count}">${el:dateTh(data.chequeDate)}</span>
												<input type="hidden" name="chequeDate" id="chequeDate${x.count}" value="${el:dateTh(data.chequeDate)}" >
											</td>
											<td>
												<c:if test="${fn:length(el:getDataUtil('CAT',data.categoryId)) > 10}">
													<span id="spanCategory${x.count}" title="${el:getDataUtil('CAT',data.categoryId)}">${fn:substring(el:getDataUtil('CAT',data.categoryId),0,10)}...</span>
												</c:if>
												<c:if test="${fn:length(el:getDataUtil('CAT',data.categoryId)) <= 10}">
													<span id="spanCategory${x.count}" title="${el:getDataUtil('CAT',data.categoryId)}">${el:getDataUtil('CAT',data.categoryId)}</span>
												</c:if>
												<input type="hidden" name="category" id="category${x.count}" value="${data.categoryId}">
											</td>
											<td align="right">
												<span id="spanChequeAmount${x.count}"><fmt:formatNumber pattern="#,##0.00" value="${data.chequeAmount}" /></span>
												<input type="hidden" name="chequeAmount" id="chequeAmount${x.count}" value="<fmt:formatNumber pattern="#,##0.00" value="${data.chequeAmount}" />">
											</td>
											<td align="right">
												<span id="spanTaxValue${x.count}"><fmt:formatNumber pattern="#,##0.00" value="${data.taxValue}" /></span>
												<input type="hidden" name="taxValue" id="taxValue${x.count}" value="<fmt:formatNumber pattern="#,##0.00" value="${data.taxValue}" />">
											</td>
											<td align="left">
												<span id="spanResponsibleName${x.count}">${data.responsibleName}</span>
												<input type="hidden" name="responsibleName" id="responsibleName${x.count}" value="${data.responsibleName}">												
											</td>
											<td>
												<span id="spanChequeDesc${x.count}">${data.chequeDesc}</span>
												<input type="hidden" name="chequeDesc" id="chequeDesc${x.count}" value="${data.chequeDesc}">
											</td>
											<td>
												<input type="checkbox" id="checkDisplay${x.count}" ${data.isBorrow=='Y'?'checked':''} disabled="disabled"/>
												<input type="hidden" name="isBorrow" id="isBorrow${x.count}" value="${data.isBorrow}">
												<input type="hidden" name="chequeSeq2" id="chequeSeq${x.count}" value="${data.chequeSeq}">	
												<input type="hidden" name="transactionTimestamp" id="transactionTimestamp" value="${data.transactionTimestamp}">			
											</td>
											<td align="center"><button type="button" name="btEdit" id="btEdit" class="acc67-button" onclick="editData('${x.count}')"/></td>
											<td align="center"><button type="button" name="btnDel" id="btnDel" class="acc67-button"  onclick="removeExpenseCheque('${data.chequeSeq}')"/></td>
										</tr>
								</c:forEach>
							</c:if>
							<tbody id="listData">
							</tbody>
						</table>
					</fieldset>
					<fieldset id="fieldUpload" style="display: none;">
						<legend> Upload File</legend>
						<table width="100%" class="acc67-grid ui-widget ui-widget-content" id="payTableDetail">
							<tr>
								<td colspan="2">
									<button type="button" name="btnDownload" id="btnDownload" class="acc67-button">Download Template</button>
								</td>
							</tr>
							<tr>
								<td  class="bold" width="20%">นำเข้าจากไฟล์ : </td>
								<td>
									<input type="file" id="btnFile" name="xlsFile" disabled="disabled"/>
									<span id="#btnFile" class="red">*</span>
								</td>
							</tr>
						</table>
					</fieldset>
				</td>
			</tr>
			<tr>
				<td colspan="2" align="center">
					<c:if test="${fn:contains(auth, 'U') || fn:contains(auth, 'I')}">
						<button type="button" name="btnSave" id="btnSave" class="acc67-button">บันทึกข้อมูล</button>
						<button type="button" name="btnConfirm" id="btnConfirm" class="acc67-button">ส่งอนุมัติ</button>
					</c:if>
					<button type="button" name="btnBack" id="btnBack" class="acc67-button">ย้อนกลับ</button>
				</td>
			</tr>
		</table>
		</form>
	</body>
</html>